<template>
<div class="resetpwd-container">
    <Button type="primary" @click="show"> 重置密码</Button>
    <Modal v-model="visible" title="重置密码" content="" :loading="loading" width="350"  @on-ok="confirm" @on-cancel="cancel">
        <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="80">
            <FormItem label="是否重置" prop="parentMobile">
            <Select v-model="formValidate.parentMobile" style="width:200px" placeholder="请选择家长手机号" @on-change="changeMobile">
                <Option v-for="item in data" :value="item.id" :key="item.id">{{ item.mobile }}</Option>
            </Select>
            </FormItem>
        </Form>
    </Modal>
</div>
</template>
<style scoped>
    .resetpwd-container {
        display: inline-block;
    }
    
    .ivu-modal-body {
        display: flex;
        align-items: center;
    }
</style>
<script>
    import userService from 'service/userService.js'
    export default {
        name: 'resetPwd',
        props: {
            data: Array
        },
        data() {
            return {
                loading: true,
                visible: false,
                choseMobileObj: {},
                formValidate: {
                    parentMobile: '',
                },
                ruleValidate: {
                    parentMobile: [{
                        required: true,
                        message: '请选择家长手机号',
                        trigger: 'blur'
                    }]
                }
            }
        },
        methods: {
            changeLoading() {
                this.loading = false;
                this.$nextTick(() => {
                    this.loading = true;
                });
            },
            confirm() {
                this.$refs["formValidate"].validate(async valid => {
                    if (valid) {
                        let parentId = this.choseMobileObj.id,
                            mobileSkey = this.choseMobileObj.mobileSkey
                        let data = {
                            "id": parentId,
                            "skey": mobileSkey
                        }

                        let jsondata = await userService.resetParentUserpassword(data)

                        let msg = jsondata.msg
                        if (jsondata.state) {
                            this.$Message.success(msg);
                            this.$refs["formValidate"].resetFields();
                            this.visible = false
                        } else {
                            this.$Message.warning(msg);
                            return this.changeLoading();
                        }
                    } else {
                        return this.changeLoading();
                    }
                })
            },
            cancel() {
                this.$refs["formValidate"].resetFields();
            },
            changeMobile(val) {
                let parentMobileObj = this.data.find((item) => {
                    return item.id == val
                })
                if (parentMobileObj) {
                    this.formValidate.parentMobile = parentMobileObj.mobile
                    this.choseMobileObj = parentMobileObj
                }

            },
            show() {
                this.visible = true
            }
        }
    }
</script>